<html>
  <head>
    <title>
      Google Visualization - Intensity Map
    </title>
    
    <!-- call the Google Java Script API -->
    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    
    <!-- call the intensitymap packages from google -->
    <script type="text/javascript">
      google.load('visualization', '1', {packages: ['intensitymap']});
    </script>
    
    <!-- This is the section that contains the data and visualization calls -->  
    <script type="text/javascript">
      function drawVisualization() {
        // Create and populate the data table.
        var data = new google.visualization.DataTable();
        data.addColumn('string', '', 'State');
        data.addColumn('number', 'Population (mil)');
        
        data.setValue(0, 0, 'IL');
        data.setValue(0, 1, 307);
       
        data.setValue(1, 0, 'IN');
        data.setValue(1, 1, 307);
      
        data.setValue(2, 0, 'WI');
        data.setValue(2, 1, 5);
        
        data.setValue(3, 0, 'IA');
        data.setValue(3, 1, 3);
        
        data.setValue(4, 0, 'MO');
        data.setValue(4, 1, 6);
       
      
        // Create and draw the visualization.
        new google.visualization.IntensityMap(document.getElementById('visualization')).draw(data, {region: 'usa'});
      }
      

      google.setOnLoadCallback(drawVisualization);
    </script>
  </head>
  <body>
    <div id="visualization"></div>
  </body>
</html>